<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Pragma" content="no-cache">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />
    <meta name="format-detection" content="telephone=no" />
    <title>发行信息</title>
    <meta content="" name="keywords" />
    <meta content="" name="description" />
    <meta content="" name="copyright" />
    <meta content="" name="author" />
    <meta name="robots" content="noarchive">
    <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="layer/layer.js"></script>
    <script src="js/map.js"></script>
    <script src="js/template-web.js"></script>
    <script type="text/javascript" src="js/urlTool.js"></script>
    <script type="text/javascript" src="js/mescroll.min.js"></script>
    <link rel="stylesheet" href="css/public.css" />
    <link rel="stylesheet" href="css/swiper.min.css" />
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/mescroll.min.css">
</head>

<body>
    <div id="mescroll" class="mescroll pb120">
    <!--头部-->
    <div class="return_top bgyellow">
        <a href="unionCenter.html">
            <span class="login_home cfff">返回中心</span>
        </a>
    </div>
    <!--//头部结束-->
        <!-- 有订单开始 -->
        <div id="recordInfo"></div>
        <!--有订单结束 -->
    </div>
</body>
<script id="tpl_no" type="text/html">
    <div class="bgfff h90 pt150">
        <div class="myorder tc c666"><img src="temp/noorder.png">
            <p class="mt70">暂无信息</p>
        </div>
    </div>
</script>
<script id="tpl" type="text/html">
    {{ set cardStatusArr = {0:'未激活',1:'已激活',2:'已过期'} }} {{each data}}
    <div class="ordercar_list bb">
        <a href="javascript:;" class="ordercar_list">
            <div class="ordercar_list_data pl20 t-ell">
                <p class="fz28 c333 t-ell">{{$value.cardNo}}</p>
                <p class="c999 pt20">{{$value.userName}}</p>
                <p class="c999 pt20">{{cardStatusArr[$value.cardStatus]}}</p>
                <p class="cred">创建时间：{{$value.addTime}}</p>
            </div>
        </a>
    </div>
    {{/each}}
</script>
<script>
    var mescroll = new MeScroll("mescroll", { //第一个参数"mescroll"对应上面布局结构div的id (1.3.5版本支持传入dom对象)
        //如果您的下拉刷新是重置列表数据,那么down完全可以不用配置,具体用法参考第一个基础案例
        //解析: down.callback默认调用mescroll.resetUpScroll(),而resetUpScroll会将page.num=1,再触发up.callback
        down: {
            //callback: downCallback //下拉刷新的回调,别写成downCallback(),多了括号就自动执行方法了
        },
        up: {
            auto: true, //是否在初始化完毕之后自动执行一次上拉加载的回调
            callback: upCallback, //上拉加载的回调
            //以下是一些常用的配置,当然不写也可以的.
            page: {
                num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
                size: 10 //每页数据条数,默认10
            },
            htmlNodata: '<p class="upwarp-nodata">-- 到底啦 --</p>',
            noMoreSize: 10, //如果列表已无数据,可设置列表的总数量要大于5才显示无更多数据;
            //避免列表数据过少(比如只有一条数据),显示无更多数据会不好看
            //这就是为什么无更多数据有时候不显示的原因.
            clearId: 'recordInfo', //加载第一页时需清空数据的列表id
            empty: {
                //列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
                warpId: "recordInfo", //父布局的id (1.3.5版本支持传入dom元素)
                tip: $("#tpl_no").html() //提示
            }
        }
    });

    //上拉加载的回调 page = {num:1, size:10}; num:当前页 默认从1开始, size:每页数据条数,默认10
    function upCallback(page) {
        var pageNum = page.num; // 页码, 默认从1开始 如何修改从0开始
        var pageSize = page.size; // 页长, 默认每页10条
        sm.req({
            url: '/sysShop/getMyCardList',
            data: {
                page: pageNum,
                limit: pageSize
            },
            done: function(res) {
                var nolist = '';
                var _str = '';
                var img_attPath = '';
                var totalSize = res.count; // 接口返回的总数据量(比如列表有26个数据,每页10条,共3页; 则totalSize值为26)
                //方法二(推荐): 后台接口有返回列表的总数据量 totalSize
                //必传参数(当前页的数据个数, 总数据量)
                mescroll.endBySize(res.data.length, totalSize);
                //设置列表数据
                if (res.data.length > 0) {
                    let html = template('tpl', res);
                    $("#recordInfo").append(html);
                }
            },
            error: function(e) {
                //联网失败的回调,隐藏下拉刷新和上拉加载的状态
                mescroll.endErr();
            }
        })
    }
</script>

</html>